<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.com">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>easyblog</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"
          integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
</head>
<body>
<!-- 顶部导航栏-start -->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <ul class="nav">
        <li class="nav-item">
            <a class="nav-link active" href="#">主页</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="#">归档</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="#">留言板</a>
        </li>
        <li class="nav-item">
            <a class="nav-link disabled">查找</a>
        </li>
    </ul>
</nav>
<!-- 顶部导航栏-end -->

<!-- 主体-start -->
<div class="col-md-8">
    <h3>Welcome to easyblog!</h3>

    <!-- 博客展示-start -->
    <div class="glyphicon-credit-card" th:each="article:${articles}">
        <div class="card-body">
            <h2 class="card-title" th:text="${article.a_title}"></h2>
            <p class="card-text" th:text="${article.a_content}"></p>
            <a th:href="@{'/detail/'+ ${article.a_id}}" class="btn btn-primary">Read More &rarr;</a>
        </div>
        <div class="card-footer">发布于 post.created_time by<a href="#"> post.author </a>
        </div>
    </div>
    <!-- 博客展示-end -->

</div>
<!-- 主体-end -->


<!-- 底部-start -->
<footer class="navbar-fixed-bottom">
    <div class="container">
        <p style="align-self: center">Copyright &copy; easyblog 2021</p>
    </div>
</footer>
<!-- 底部-end -->


<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
        crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF"
        crossorigin="anonymous"></script>
</body>
</html>